<template>
	<view>
		<u-status-bar></u-status-bar>
		<view class="con">
			<view class="u-flex u-flex-y-center">

				<image @click="uphead" :src="user.headUrl?user.headUrl:'/static/img/team/tx.png'" class="con__tx"
					mode="aspectFill">
				</image>
				<view class="con__head">
					<view class="u-flex u-flex-y-center">
						<view class="con__head__username">
							{{user.name}}
						</view>
						<view class="con__head__lv u-flex u-flex-y-center" v-if="user.accountType==0">
							普通帐号
						</view>
						<view class="con__head__lv u-flex u-flex-y-center lv1" v-if="user.accountType==2">
							<image src="/static/img/my/tz.png" style="height: 28rpx;margin-right: 12rpx;"
								mode="heightFix"></image>团长账户
						</view>
						<view class="con__head__lv u-flex u-flex-y-center lv2" v-if="user.accountType==1">
							<image src="/static/img/my/jp.png" style="height: 28rpx;margin-right: 12rpx;"
								mode="heightFix"></image>金牌账户
						</view>
						<view class="con__head__lv u-flex u-flex-y-center lv2" v-if="user.accountType==3">
							<image src="/static/img/my/jp.png" style="height: 28rpx;margin-right: 12rpx;"
								mode="heightFix"></image>合伙人
						</view>
					</view>
					<view class="u-flex u-flex-y-center">
						<view class="con__head__id">
							ID：{{user.id}}
						</view>
						<view class="con__head__yq">
							邀请码：{{user.inviteCode}}
						</view>
						<view class="con__head__copy" @click="copy(user.inviteCode)">
							复制
						</view>
					</view>
				</view>
			</view>
			<view class="con__box">
				<view class="con__box__top">
					<view class="con__box__top__name">
						账户余额
					</view>
					<view class="con__box__top__value">
						{{user.accountBalance.toFixed(2)}}元
					</view>
					<view class="con__box__top__btn">
						<u-button text="提现" @click="clicktx" color="#6492FF" shape='circle'></u-button>
					</view>
				</view>
				<view class="con__box__sy">
					<view class="con__box__sy__item" @click="navto('/pages/my/income?type=1')">
						<view class="con__box__sy__item__value">
							{{user.dayIncome.toFixed(2)}}
						</view>
						<view class="con__box__sy__item__text">
							今日收益
						</view>
					</view>
					<view class="con__box__sy__item" @click="navto('/pages/my/income?type=2')">
						<view class="con__box__sy__item__value">
							{{user.monthIncome.toFixed(2)}}
						</view>
						<view class="con__box__sy__item__text">
							当月收益
						</view>
					</view>
					<view class="con__box__sy__item" @click="navto('/pages/my/income')">
						<view class="con__box__sy__item__value">
							{{user.totalIncome.toFixed(2)}}
						</view>
						<view class="con__box__sy__item__text">
							累计收益
						</view>
					</view>
				</view>
			</view>
			<view class="con__tab">
				<view class="con__tab__item" @click="navto('/pages/my/order?current='+index)"
					v-for="(item,index) in tablist" :key="index">
					<image :src="'/static/img/my/'+item.icon+'.png'" class="con__tab__item__icon" mode=""></image>
					<view class="con__tab__item__text">
						{{item.text}}
					</view>
				</view>
			</view>
			<view class="con__item" v-for="(item,index) in list" :key="index" @click="clickitem(item)">
				<view class="u-flex u-flex-y-center">
					<image :src="'/static/img/my/'+item.icon+'.png'" class="con__item__icon" mode=""></image>
					<view class="con__item__text">
						{{item.text}}
					</view>
				</view>
				<view class="u-flex u-flex-y-center">
					<view class="con__item__value">
						{{item.value}}
					</view>
					<image src="/static/img/home/more.png" class="con__item__more" mode=""></image>
				</view>
			</view>

		</view>
		<u-modal :show="show" title='关注“一起推”微信公众号' @confirm="show=false,getuser()" @cancel='show=false' showCancelButton
			cancel-text="关闭" confirm-text="已绑定">
			<view class="mdbox">
				<view class="">
					请截屏用微信扫一扫
				</view>
				<view class="">
					实时了解结算、产品等信息
				</view>
				<image :src="qrcode" class="mdbox__qr" mode=""></image>
			</view>
		</u-modal>
		<image src="/static/img/home/kf.png" @click="navto('/pages/home/kh')" class="kf" mode=""></image>
	</view>
</template>

<script>
	import {
		customeredit,
		bindWx,
		userinfo,
		unBindWx
	} from '@/api/user.js'
	export default {
		data() {

			return {
				show: false,
				tablist: [{
						text: '全部订单',
						icon: 'dd',
						url: '',
						status: ''
					},
					{
						text: '审核中',
						icon: 'sh',
						url: '',
						status: 0
					},
					{
						text: '已完成',
						icon: 'wc',
						url: '',
						status: 1
					},
					{
						text: '不合格',
						icon: 'bhg',
						url: '',
						status: 2
					},
				],
				list: [{
						text: '收入记录',
						icon: 'sr',
						value: '',
						url: '/pages/my/income'
					},
					{
						text: 'APP下载',
						icon: 'xz',
						value: '',
						url: ''
					},
					{
						text: '实名认证',
						icon: 'sm',
						value: '',
						url: '/pages/my/authentication'
					},
					{
						text: '联系上级',
						icon: 'kf',
						value: '',
						url: '/pages/my/connection'
					},
					{
						text: '我的报备',
						icon: 'bb',
						value: '',
						url: '/pages/my/filelist'
					},
					{
						text: '佣金升级',
						icon: 'sj',
						value: '',
						url: '/pages/my/upgrades'
					},
					{
						text: '公告通知',
						icon: 'gg',
						value: '',
						url: '/pages/home/notice'
					},
					{
						text: '商务合作',
						icon: 'sw',
						value: '',
						url: '/pages/my/cooperation'
					},
					{
						text: '微信公众号',
						icon: 'wx',
						value: '未绑定',
						url: ''
					},
					{
						text: '意见建议',
						icon: 'jy',
						value: '',
						url: '/pages/my/advice'
					},
					{
						text: '设置',
						icon: 'sz',
						value: '',
						url: '/pages/my/set'
					},
				],
				user: {},
				qrcode: ''
			};
		},
		methods: {
			clickitem(item) {
				let _this=this
				
				if (item.text == '微信公众号') {
					console.log(_this.user.openId)
					if(_this.user.openId){//已绑定
						uni.showModal({
							title:'是否解除绑定公众号?',
							success(r) {
								if(r.confirm){
									unBindWx().then(res=>{
										if(res.data.code==200){
											_this.user.openId=''
											_this.$u.toast('解绑成功')
											_this.getuser()
										}
									})
								}
							}
						})
					}else{
						this.show = true
						bindWx().then(res => {
							if (res.data.code == 200) {
								this.qrcode = res.data.data
							}
						})
					}
				}else if(item.text == 'APP下载'){
					window.open('http://wap.yijueze.com/#/pages/download')
				} else {
					this.navto(item.url)

				}
			},
			getuser() {
				userinfo().then(res => {
					uni.stopPullDownRefresh()
					if (res.data.code == 200) {
						this.user = res.data.data
						uni.setStorageSync('ytbuser', res.data.data)
						
						this.list.map(t => {
							if (t.text == '实名认证' && this.user.credit == 0) {
								t.value = '未实名'
							}
							if (t.text == '实名认证' && this.user.credit == 1) {
								t.value = '已实名'
							}
							if (this.user.openId && t.text == '微信公众号') { //已绑定微信公众号
								t.value = '解除绑定'
							}
							if (!this.user.openId && t.text == '微信公众号') { //已绑定微信公众号
								t.value = '未绑定'
							}
						})
					}
				})
			},
			clicktx() {
				if (this.user.credit == 0) {
					this.$u.toast('请先进行实名认证')
					return
				}
				this.navto('/pages/my/purse')
			},
			uphead() {
				let _this = this
				// console..log
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						uni.showLoading({
							title: '上传中'
						})
						uni.uploadFile({
							url: _this.$BASE_URL + '/app/upload', //仅为示例，非真实的接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							header: {
								Authorization: uni.getStorageSync('ytbtoken')
							},
							success: (uploadFileRes) => {
								if (JSON.parse(uploadFileRes.data).code == 200) {
									uni.hideLoading()
									// 调用修改接口
									customeredit({
										headUrl: JSON.parse(uploadFileRes.data).data.url
									}).then(res1 => {
										if (res1.data.code == 200) {
											this.user.headUrl = JSON.parse(uploadFileRes
												.data).data.url
											_this.getuser()
										} else {
											uni.reLaunch({
												url: '/pages/index/login'
											})
										}
									})
									_this.$forceUpdate()
								} else {
									uni.reLaunch({
										url: '/pages/index/login'
									})
								}
							}
						});
					}
				});
			},
			
		},
		onLoad() {
			this.getuser()
		},
		onShow() {
			this.user = uni.getStorageSync('ytbuser')
			
			this.getuser()

		},
		onPullDownRefresh() {
			this.getuser()
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f6f6f6;
	}

	.con {
		padding: 28rpx 16rpx 156rpx;

		&__tx {
			width: 110.42rpx;
			height: 110.42rpx;
			border-radius: 50%;
			margin-left: 15rpx;
			margin-right: 30rpx;
		}

		&__head {
			height: 110.42rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			font-family: Source Han Sans SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #707070;
			line-height: 28rpx;

			&__username {
				font-family: Source Han Sans SC;
				font-weight: bold;
				font-size: 36rpx;
				color: #3E3D3D;
				line-height: 36rpx;
				margin-right: 30rpx;
			}

			&__lv {
				padding: 0 20rpx;
				line-height: 50rpx;
				border-radius: 28rpx;
				border: 2rpx solid #6492FF;
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 28rpx;
				color: #6492FF;
			}

			&__id {
				margin-right: 28rpx;
			}

			&__yq {
				margin-right: 12rpx;
			}

			&__copy {
				width: 85rpx;
				height: 46rpx;
				border-radius: 24rpx;
				border: 1rpx solid #707070;
				display: flex;
				align-items: center;
				justify-content: center;
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 28rpx;
				color: #707070;
			}
		}

		&__box {
			background: #FFFFFF;
			border-radius: 14rpx;
			padding: 30rpx 80rpx;
			margin-top: 28rpx;

			&__top {
				display: flex;
				justify-content: space-between;
				align-items: end;
				border-bottom: 1rpx solid #D2D2D2;
				padding-bottom: 22rpx;

				&__name {
					font-family: Source Han Sans SC;
					font-weight: bold;
					font-size: 36rpx;
					color: #3E3D3D;
				}

				&__value {
					font-family: Source Han Sans SC;
					font-weight: bold;
					font-size: 36rpx;
					color: #6492FF;
				}

				&__btn {
					width: 113.19rpx;
				}
			}

			&__sy {
				display: flex;
				align-items: center;
				justify-content: space-between;

				&__item {
					width: 33.33%;
					display: flex;
					flex-direction: column;
					align-items: center;
					font-family: Source Han Sans SC;
					font-weight: 400;
					font-size: 30rpx;
					color: #3E3D3D;
					line-height: 30rpx;

					&__value {
						margin: 22rpx 0;
					}
				}
			}
		}

		&__tab {
			background: #FFFFFF;
			border-radius: 14rpx;
			padding: 12rpx 50rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 28rpx;

			&__item {
				display: flex;
				flex-direction: column;
				align-items: center;

				&__icon {
					width: 56rpx;
					height: 56rpx;
					margin-bottom: 16rpx;
				}
			}
		}

		&__item {
			margin-top: 28rpx;
			padding: 0 52rpx;
			height: 73rpx;
			background: #FFFFFF;
			border-radius: 14rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			&__icon {
				width: 38rpx;
				height: 38rpx;
				margin-right: 36rpx;
			}

			&__text {
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 30rpx;
				color: #3E3D3D;
				line-height: 30rpx;
			}

			&__value {
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 30rpx;
				color: #707070;
				line-height: 30rpx;
				margin-right: 20rpx;
			}

			&__more {
				width: 21rpx;
				height: 28rpx;
			}
		}
	}

	.lv1 {
		color: #2C2C2C;
		border-color: #2C2C2C;
	}

	.lv2 {
		color: #F6BC0A;
		border-color: #F6BC0A;
	}

	/deep/.u-button {
		height: 50.69rpx;
	}

	.mdbox {
		display: flex;
		flex-direction: column;
		align-items: center;
		font-family: Source Han Sans SC;
		font-weight: 400;
		font-size: 30rpx;
		color: #3E3D3D;
		line-height: 50rpx;

		&__qr {
			width: 395.83rpx;
			height: 395.83rpx;
			margin: 28rpx 0 0;
		}
	}

	.kf {
		width: 80rpx;
		height: 80rpx;
		position: fixed;
		bottom: 300rpx;
		right: 30rpx;
		background-color: #fff;
		border-radius: 50%;
	}
</style>